<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<!-- BEGIN:Head -->
<head>
	<meta charset="utf-8" />
	<title>控制面板 - 智慧排课系统</title>
	<!-- icon -->
	<link rel="shortcut icon" th:href="@{/static/picture/favicon.ico}" />
	<!-- BEGIN:CSS Assets-->
	<link rel="stylesheet" th:href="@{static/css/app.css}" />
	<!-- END:CSS Assets-->
</head>
<body>
<!-- END:Mobile Menu -->
<div class="flex">
	<!-- 根据用户类型返回操作侧边栏 -->
	<div th:replace="~{commons/menu::${session.userType}(active='index') }"></div>
	<!-- BEGIN:Content -->
	<div class="content">
		<!-- BEGIN:Top Bar -->
		<div class="top-bar">
			<!-- BEGIN:Breadcrumb -->
			<div class="-intro-x breadcrumb mr-auto hidden sm:flex">
				<a href="" class="">应用</a>
				<i data-feather="chevron-right" class="breadcrumb__icon"></i>
				<a href="" class="breadcrumb--active">控制台</a>
			</div>
			<!-- END:Breadcrumb --><!-- BEGIN:Search -->
			<div class="intro-x relative mr-3 sm:mr-6">
				<div class="search hidden sm:block">
					<input type="text" class="search__input input placeholder-theme-13" placeholder="Search...">
					<i data-feather="search" class="search__icon"></i>
				</div>
				<a class="notification sm:hidden" href="">
					<i data-feather="search" class="notification__icon"></i>
				</a>
				<div class="search-result">
					<div class="search-result__content">
						<div class="search-result__content__title">
							页面
						</div>
						<div class="mb-5">
							<a href="" class="flex items-center">
								<div class="w-8 h-8 bg-theme-18 text-theme-9 flex items-center justify-center rounded-full">
									<i class="w-4 h-4" data-feather="inbox"></i>
								</div>
								<div class="ml-3">
									系统信息
								</div>
							</a>
						</div>
						<div class="search-result__content__title">
							用户
						</div>
						<div class="mb-5">
							<a href="" class="flex items-center mt-2">
								<div class="w-8 h-8 image-fit">
									<img alt="Midone Tailwind HTML Admin Template" class="rounded-full" src="static/picture/profile-14.jpg">
								</div>
								<div class="ml-3">
									吴泽胜
								</div>
								<div class="ml-auto w-48 truncate text-gray-600 text-xs text-right">
									angelinajolie@left4code.com
								</div>
							</a>
						</div>
					</div>
				</div>
			</div>
			<!-- END:Notifications --><!-- BEGIN:Account Menu -->
			<div class="intro-x relative mr-3 sm:mr-6" th:text=" '欢迎回来！' + ${session.NickName}"></div>
			<div th:replace="~{commons/info::${session.userType}}"></div>
			<!-- END:Account Menu -->
		</div>
		<div class="grid grid-cols-16 gap-6">
			<div class="col-span-12 xxl:col-span-9 grid grid-cols-12 gap-6">
				<!-- BEGIN:General Report -->
				<div class="col-span-12 mt-8">
					<div class="intro-y flex items-center h-10">
						<h2 class="text-lg font-medium truncate mr-5">General Report </h2>
						<a href="" class="ml-auto flex text-theme-1"><i data-feather="refresh-ccw" class="w-4 h-4 mr-3"></i>Reload Data </a>
					</div>
					<div class="grid grid-cols-12 gap-6 mt-5">
						<div class="col-span-12 sm:col-span-6 xl:col-span-3 intro-y">
							<div class="report-box zoom-in">
								<div class="box p-5">
									<div class="flex">
										<i data-feather="shopping-cart" class="report-box__icon text-theme-10"></i>
										<div class="ml-auto">
											<div class="report-box__indicator bg-theme-9 tooltip cursor-pointer" title="33% Higher than last month">
												33% <i data-feather="chevron-up" class="w-4 h-4"></i>
											</div>
										</div>
									</div>
									<div class="text-3xl font-bold leading-8 mt-6">
										4.510
									</div>
									<div class="text-base text-gray-600 mt-1">
										Item Sales
									</div>
								</div>
							</div>
						</div>
						<div class="col-span-12 sm:col-span-6 xl:col-span-3 intro-y">
							<div class="report-box zoom-in">
								<div class="box p-5">
									<div class="flex">
										<i data-feather="credit-card" class="report-box__icon text-theme-11"></i>
										<div class="ml-auto">
											<div class="report-box__indicator bg-theme-6 tooltip cursor-pointer" title="2% Lower than last month">
												2% <i data-feather="chevron-down" class="w-4 h-4"></i>
											</div>
										</div>
									</div>
									<div class="text-3xl font-bold leading-8 mt-6">
										3.521
									</div>
									<div class="text-base text-gray-600 mt-1">
										New Orders
									</div>
								</div>
							</div>
						</div>
						<div class="col-span-12 sm:col-span-6 xl:col-span-3 intro-y">
							<div class="report-box zoom-in">
								<div class="box p-5">
									<div class="flex">
										<i data-feather="monitor" class="report-box__icon text-theme-12"></i>
										<div class="ml-auto">
											<div class="report-box__indicator bg-theme-9 tooltip cursor-pointer" title="12% Higher than last month">
												12% <i data-feather="chevron-up" class="w-4 h-4"></i>
											</div>
										</div>
									</div>
									<div class="text-3xl font-bold leading-8 mt-6">
										2.145
									</div>
									<div class="text-base text-gray-600 mt-1">
										Total Products
									</div>
								</div>
							</div>
						</div>
						<div class="col-span-12 sm:col-span-6 xl:col-span-3 intro-y">
							<div class="report-box zoom-in">
								<div class="box p-5">
									<div class="flex">
										<i data-feather="user" class="report-box__icon text-theme-9"></i>
										<div class="ml-auto">
											<div class="report-box__indicator bg-theme-9 tooltip cursor-pointer" title="22% Higher than last month">
												22% <i data-feather="chevron-up" class="w-4 h-4"></i>
											</div>
										</div>
									</div>
									<div class="text-3xl font-bold leading-8 mt-6">
										152.000
									</div>
									<div class="text-base text-gray-600 mt-1">
										Unique Visitor
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<!-- END:General Report --><!-- BEGIN:Sales Report -->
				<div class="col-span-12 lg:col-span-6 mt-8">
					<div class="intro-y block sm:flex items-center h-10">
						<h2 class="text-lg font-medium truncate mr-5">Sales Report </h2>
						<div class="sm:ml-auto mt-3 sm:mt-0 relative text-gray-700">
							<i data-feather="calendar" class="w-4 h-4 z-10 absolute my-auto inset-y-0 ml-3 left-0"></i><input type="text" data-daterange="true" class="datepicker input w-full sm:w-56 box pl-10">
						</div>
					</div>
					<div class="intro-y box p-5 mt-12 sm:mt-5">
						<div class="flex flex-col xl:flex-row xl:items-center">
							<div class="flex">
								<div>
									<div class="text-theme-20 text-lg xl:text-xl font-bold">
										$15,000
									</div>
									<div class="text-gray-600">
										This Month
									</div>
								</div>
								<div class="w-px h-12 border border-r border-dashed border-gray-300 mx-4 xl:mx-6">
								</div>
								<div>
									<div class="text-gray-600 text-lg xl:text-xl font-medium">
										$10,000
									</div>
									<div class="text-gray-600">
										Last Month
									</div>
								</div>
							</div>
							<div class="dropdown relative xl:ml-auto mt-5 xl:mt-0">
								<button class="dropdown-toggle button font-normal border text-white relative flex items-center text-gray-700">Filter by Category <i data-feather="chevron-down" class="w-4 h-4 ml-2"></i></button>
								<div class="dropdown-box mt-10 absolute w-40 top-0 xl:right-0 z-20">
									<div class="dropdown-box__content box p-2 overflow-y-auto h-32">
										<a href="" class="flex items-center block p-2 transition duration-300 ease-in-out bg-white hover:bg-gray-200 rounded-md">PC & Laptop</a><a href="" class="flex items-center block p-2 transition duration-300 ease-in-out bg-white hover:bg-gray-200 rounded-md">Smartphone</a><a href="" class="flex items-center block p-2 transition duration-300 ease-in-out bg-white hover:bg-gray-200 rounded-md">Electronic</a><a href="" class="flex items-center block p-2 transition duration-300 ease-in-out bg-white hover:bg-gray-200 rounded-md">Photography</a><a href="" class="flex items-center block p-2 transition duration-300 ease-in-out bg-white hover:bg-gray-200 rounded-md">Sport</a>
									</div>
								</div>
							</div>
						</div>
						<div class="report-chart">
							<canvas id="report-line-chart" height="160" class="mt-6"></canvas>
						</div>
					</div>
				</div>
				<!-- END:Sales Report --><!-- BEGIN:Weekly Top Seller -->
				<div class="col-span-12 sm:col-span-6 lg:col-span-3 mt-8">
					<div class="intro-y flex items-center h-10">
						<h2 class="text-lg font-medium truncate mr-5">Weekly Top Seller </h2>
						<a href="" class="ml-auto text-theme-1 truncate">See all</a>
					</div>
					<div class="intro-y box p-5 mt-5">
						<canvas class="mt-3" id="report-pie-chart" height="280"></canvas>
						<div class="mt-8">
							<div class="flex items-center">
								<div class="w-2 h-2 bg-theme-11 rounded-full mr-3">
								</div>
								<span class="truncate">17 - 30 Years old</span>
								<div class="h-px flex-1 border border-r border-dashed border-gray-300 mx-3 xl:hidden">
								</div>
								<span class="font-medium xl:ml-auto">62%</span>
							</div>
							<div class="flex items-center mt-4">
								<div class="w-2 h-2 bg-theme-1 rounded-full mr-3">
								</div>
								<span class="truncate">31 - 50 Years old</span>
								<div class="h-px flex-1 border border-r border-dashed border-gray-300 mx-3 xl:hidden">
								</div>
								<span class="font-medium xl:ml-auto">33%</span>
							</div>
							<div class="flex items-center mt-4">
								<div class="w-2 h-2 bg-theme-12 rounded-full mr-3">
								</div>
								<span class="truncate">>= 50 Years old</span>
								<div class="h-px flex-1 border border-r border-dashed border-gray-300 mx-3 xl:hidden">
								</div>
								<span class="font-medium xl:ml-auto">10%</span>
							</div>
						</div>
					</div>
				</div>
				<!-- END:Weekly Top Seller --><!-- BEGIN:Sales Report -->
				<div class="col-span-12 sm:col-span-6 lg:col-span-3 mt-8">
					<div class="intro-y flex items-center h-10">
						<h2 class="text-lg font-medium truncate mr-5">Sales Report </h2>
						<a href="" class="ml-auto text-theme-1 truncate">See all</a>
					</div>
					<div class="intro-y box p-5 mt-5">
						<canvas class="mt-3" id="report-donut-chart" height="280"></canvas>
						<div class="mt-8">
							<div class="flex items-center">
								<div class="w-2 h-2 bg-theme-11 rounded-full mr-3">
								</div>
								<span class="truncate">17 - 30 Years old</span>
								<div class="h-px flex-1 border border-r border-dashed border-gray-300 mx-3 xl:hidden">
								</div>
								<span class="font-medium xl:ml-auto">62%</span>
							</div>
							<div class="flex items-center mt-4">
								<div class="w-2 h-2 bg-theme-1 rounded-full mr-3">
								</div>
								<span class="truncate">31 - 50 Years old</span>
								<div class="h-px flex-1 border border-r border-dashed border-gray-300 mx-3 xl:hidden">
								</div>
								<span class="font-medium xl:ml-auto">33%</span>
							</div>
							<div class="flex items-center mt-4">
								<div class="w-2 h-2 bg-theme-12 rounded-full mr-3">
								</div>
								<span class="truncate">>= 50 Years old</span>
								<div class="h-px flex-1 border border-r border-dashed border-gray-300 mx-3 xl:hidden">
								</div>
								<span class="font-medium xl:ml-auto">10%</span>
							</div>
						</div>
					</div>
				</div>
				<!-- BEGIN:General Report -->
				<div class="col-span-12 grid grid-cols-12 gap-6 mt-8">
					<div class="col-span-12 sm:col-span-6 xxl:col-span-3 intro-y">
						<div class="mini-report-chart box p-5 zoom-in">
							<div class="flex items-center">
								<div class="w-2/4 flex-none">
									<div class="text-lg font-medium truncate">
										Target Sales
									</div>
									<div class="text-gray-600 mt-1">
										300 Sales
									</div>
								</div>
								<div class="flex-none ml-auto relative">
									<canvas id="report-donut-chart-1" width="90" height="90"></canvas>
									<div class="font-medium absolute w-full h-full flex items-center justify-center top-0 left-0">
										20%
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="col-span-12 sm:col-span-6 xxl:col-span-3 intro-y">
						<div class="mini-report-chart box p-5 zoom-in">
							<div class="flex">
								<div class="text-lg font-medium truncate mr-3">
									Social Media
								</div>
								<div class="py-1 px-2 rounded-full text-xs bg-gray-200 text-gray-600 cursor-pointer ml-auto truncate">
									320 Followers
								</div>
							</div>
							<div class="mt-4">
								<canvas class="simple-line-chart-1 -ml-1" height="60"></canvas>
							</div>
						</div>
					</div>
					<div class="col-span-12 sm:col-span-6 xxl:col-span-3 intro-y">
						<div class="mini-report-chart box p-5 zoom-in">
							<div class="flex items-center">
								<div class="w-2/4 flex-none">
									<div class="text-lg font-medium truncate">
										New Products
									</div>
									<div class="text-gray-600 mt-1">
										1450 Products
									</div>
								</div>
								<div class="flex-none ml-auto relative">
									<canvas id="report-donut-chart-2" width="90" height="90"></canvas>
									<div class="font-medium absolute w-full h-full flex items-center justify-center top-0 left-0">
										45%
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="col-span-12 sm:col-span-6 xxl:col-span-3 intro-y">
						<div class="mini-report-chart box p-5 zoom-in">
							<div class="flex">
								<div class="text-lg font-medium truncate mr-3">
									Posted Ads
								</div>
								<div class="py-1 px-2 rounded-full text-xs bg-gray-200 text-gray-600 cursor-pointer ml-auto truncate">
									180 Campaign
								</div>
							</div>
							<div class="mt-4">
								<canvas class="simple-line-chart-1 -ml-1" height="60"></canvas>
							</div>
						</div>
					</div>
				</div>
				<!-- END:Weekly Top Seller -->
			</div>
	</div>
	</div>
</div>
	<!-- END:Content -->
<!-- BEGIN:JS Assets-->
<script th:src="@{static/js/js.js}"></script>
<script th:src="@{static/js/app.js}"></script>
<!-- END:JS Assets-->
</body>
</html>
